【krpano】ホットスポットを配置する

パノラマの中にホットスポットを配置する。
kpranoのデフォルトのホットスポット画像

hotspot_ani_black_64x64x20.pngを配置する方法。
ホットスポット:ツアーや何かのアクションを起こすためにパノラマの中に配置した画像。

【使用するファイル】
hotspot_ani_black_64x64x20.png
xmlファイル

【準備】
krpano Viewerのフォルダの中のhotspotsフォルダを、

ホットスポットを配置したいパノラマのxmlファイルと同じフォルダの中にコピーする。

【基本コード】画像用
以下のコードをxmlファイル内に記述する

<style name="hotspot_ani_black"
url="hotspots/hotspot_ani_black_64x64x20.png"
crop="0|0|64|64"
framewidth="64" frameheight="64" frame="0" lastframe="19"
onloaded="hotspot_animate();"
/>

【基本コード】アクション
以下のコードをxmlファイル内に記述する

<action name="hotspot_animate">
inc(frame,1,get(lastframe),0);
mul(ypos,frame,frameheight);
txtadd(crop,'0|',get(ypos),'|',get(framewidth),'|',get(frameheight));
delayedcall(0.03, if(loaded, hotspot_animate() ) );
</action>

【基本コード】画像表示用
以下のコードをxmlファイル内に記述する

<hotspot name="spot1" style="hotspot_ani_black" ath="0" atv="0"/>

複数表示する場合は

<hotspot name="spot2" style="hotspot_ani_black" ath="10" atv="10"/>
<hotspot name="spot3" style="hotspot_ani_black" ath="20" atv="20"/>

【実例】

<krpano version="1.16" >

<include url="skin/defaultskin.xml" />

<view hlookat="0" vlookat="0" maxpixelzoom="1.0" fovmax="150" limitview="auto" />

<preview url="mukogawa1.tiles/preview.jpg" />

<image type="CUBE" multires="true" tilesize="512" progressive="false">
<level tiledimagewidth="4776" tiledimageheight="4776">
<cube url="mukogawa1.tiles/mres_%s/l4/%0v/l4_%s_%0v_%0h.jpg" />
</level>
<level tiledimagewidth="2388" tiledimageheight="2388">
<cube url="mukogawa1.tiles/mres_%s/l3/%0v/l3_%s_%0v_%0h.jpg" />
</level>
<level tiledimagewidth="1194" tiledimageheight="1194">
<cube url="mukogawa1.tiles/mres_%s/l2/%0v/l2_%s_%0v_%0h.jpg" />
</level>
<level tiledimagewidth="597" tiledimageheight="597">
<cube url="mukogawa1.tiles/mres_%s/l1/%0v/l1_%s_%0v_%0h.jpg" />
</level>
<mobile>
<cube url="mukogawa1.tiles/mobile_%s.jpg" />
</mobile>
</image>

<style name="hotspot_ani_white"
url="hotspots/hotspot_ani_white_64x64x20.png"
crop="0|0|64|64"
framewidth="64" frameheight="64" frame="0" lastframe="19"
onloaded="hotspot_animate();"
/>

<action name="hotspot_animate">
inc(frame,1,get(lastframe),0);
mul(ypos,frame,frameheight);
txtadd(crop,'0|',get(ypos),'|',get(framewidth),'|',get(frameheight));
delayedcall(0.03, if(loaded, hotspot_animate() ) );
</action>

<hotspot name="spot1" style="hotspot_ani_white" ath="0" atv="0"/>

</krpano>